<script setup lang="ts">
import { IActionParam, IParam } from "@interface";
import { AppForm } from "../../widgets";
import { AppViewLayout } from "@components";
import { getViewRuntimeParam, useContextParams } from "@core";
import { Subject } from "rxjs";
import { onMounted, Ref, ref } from "vue";
import { viewMounted } from "@core/modules/views/edit-view-help";
interface ViewProps {
  /**
   * 上下文参数
   */
  contextProp: any;

  /**
   * 视图参数
   */
  viewParamsProp?: any;

  /**
   * 视图打开方式，路由、模态、内嵌，默认为路由方式
   */
  openTypeProp?: "ROUTE" | "MODAL" | "EMBED";

  /**
   * 视图状态通讯对象(单个视图（路由为顶层视图）)
   */
  viewState?: any;
}
interface ViewEmit {
  (name: "CLOSE", value: IActionParam): void;
  (name: "VIEWCHANGE", value: IActionParam): void;
}
const props = withDefaults(defineProps<ViewProps>(), {
  openTypeProp: "ROUTE",
  viewState: new Subject<IActionParam>(),
});

const emit = defineEmits<ViewEmit>();

// 自持变量初始化
const { context, viewParams } = useContextParams(props);
const viewCaption: Ref<string> = ref("编辑视图");

/**
 * @description 模型参数
 */
const modelParam: IParam = {
  formName: 'form'
};

const form = ref(null);

/**
 * @description 运行时参数
 */
const runtimeParam: IParam = {
  context: context,
  viewParams: viewParams,
  viewState: props.viewState,
};

onMounted(() => {
  viewMounted(modelParam, getViewRuntimeParam(runtimeParam, {
    form: form
  }));
});
</script>

<template>
  <AppViewLayout class="ibiz-view-container">
    <template #header>
      <h2>{{ viewCaption }}</h2>
    </template>
    <AppForm
      ref="form"
      name="form"
      :showBusyIndicatorProp="true"
      :contextProp="context"
      :viewParamsProp="viewParams"
      :viewState="viewState"
    ></AppForm>
  </AppViewLayout>
</template>

<style scoped>
.ibiz-view-container {
  height: 100%;
  width: 100%;
}
</style>